<template>
  <view class="center">
    <!-- 背景 -->
    <view class="bg"></view>
    <!-- 头部 -->
    <v-header :user="user" />
    <!-- 帐户 -->
    <v-account :account="account" :vip="vip" />
    <!-- 订单 -->
    <v-order />
    <!-- 轮播图 -->
    <v-swiper :list="swiper" />
    <!-- 服务 -->
    <v-service />
    <!-- 头像设置 -->
    <u-modal :show="showTip" @confirm="confirmTip" @cancel="showTip = false" ref="uModal" :showCancelButton="true">
      {{ tip_text }}
    </u-modal>
  </view>
</template>

<script>

import Header from '../components/center/Header'
import Account from '../components/center/Account'
import Order from '../components/center/Order'
import Swiper from '../components/center/Swiper'
import Service from '../components/center/Service'

import { _isLogin } from '../../../util/util'
import { goLogin } from '../../../util/platform'

import HomeModel from '../../../api/home'
import UserModel from '../../../api/user'
import base64 from '../../../util/base64'
const userModel = new UserModel()
const homeModel = new HomeModel()

export default {
  props: ['refresh'],
  components: {
    'v-header': Header,
    'v-account': Account,
    'v-order': Order,
    'v-swiper': Swiper,
    'v-service': Service,
  },
  data() {
    return {
      user: {},
      account: [],
      swiper: [],
      // 头像设置提示
      showTip: false,
      tip_text: '您还没有设置昵称或者头像,现在去设置?',
      vip: {}
    }
  },
  watch: {
    refresh: {
      handler(newTime, oldTime) {
        // console.log(oldTime, newTime, newTime - oldTime)
        if (newTime - oldTime > 1 * 1000 && this.tab.url === '/pages/category/center') {
          // this.$store.dispatch('Uni/set_category', null).then(() => {})
          // this.fetch()
          console.log(22)
        }
      }
    },
    // 解决登录刷新
    t: {
      handler(v) {
        // this.init()
      }
    }
  },
  methods: {
    // 获取轮播图
    getSwiper() {
      homeModel.getCenterSwiper().then(response => {
        let { data } = response
        data = base64.parse(data)
        this.swiper = data.list
      })
    },
    // 获取用户信息
    getInfo() {
      userModel.getInfo().then(response => {
        let { data } = response
        data = base64.parse(data)
        // console.log('center: ', data)

        // 保存到store中
        this.$store.dispatch('User/set_info', data).then(() => {
          this.user = data
        })

        // vip
        if (data.vip) {
          this.vip = data.vip
        }

        // account
        if (data.account) {
          const account = data.account
          const balance = Number.parseFloat(+account.balance) || 0
          const score = Number.parseFloat(+account.score) || 0
          this.account = [
            { total: +balance.toFixed(2), text: '余额', url: '/sub_common/balance/index' },
            { total: +score.toFixed(2), text: '积分', url: '/sub_common/score/index' },
          ]
        }

        // avatar tip
        /*#ifdef APP-PLUS || H5*/
        if (!data.avatar || !data.nickname) {
          this.showTip = true
        }
        /*#endif*/
        /*#ifdef MP-WEIXIN*/
        if (!data.avatar && (!data.base64Image && +data.av === 0)) {
          const key = 'update_avatar'
          const is = uni.getStorageSync(key)
          if (!is) {
            uni.setStorageSync(key, true)
            uni.showModal({
              title: this.tip_text,
              confirmText: '立即设置',
              success: res => {
                if (res.confirm) {
                  uni.navigateTo({
                    url: '/sub_common/user/wx_avatar'
                  })
                }
              }
            })
          }
        }
        /*#endif*/

        // 小程序手机号获取
        /*#ifdef MP-WEIXIN*/
        // 微信小程序端执行的逻辑
        if (!data.mobile) {
          uni.showModal({
            title: '您还没有绑定手机号码',
            confirmText: '立即设置',
            success: res => {
              if (res.confirm) {
                uni.navigateTo({
                  url: '/sub_common/user/mobile'
                })
              }
            }
          })
        }
        /*#endif*/
      })
    },
    init() {
      uni.pageScrollTo({
        scrollTop: 0,
        duration: 10
      })
      // 判断登录否
      _isLogin().then(() => {
        this.getSwiper()
        this.getInfo()
      }).catch(() => {
        uni.showModal({
          title: '需要登录才能继续操作',
          confirmText: '立即登录',
          success: res => {
            if (res.confirm) {
              goLogin()
            } else {
            }
          }
        })
      })
    },
    // 确认设置头像
    confirmTip() {
      this.showTip = false
      uni.navigateTo({
        url: '/sub_common/user/avatar'
      })
    },
  },
  created() {
    this.init()
  },
  mounted() {
  }
}
</script>

<style scoped lang="scss">
.center {
  background: $background_color;
  padding-bottom: 100px;
  .bg {
    background-image: url('#{$base_url}/mini/bg/center.png');
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center center;
    margin-bottom: -190px;
    padding-top: 10px;
    box-sizing: border-box;
    height: 190px;
  }
}
</style>
